<template>
  <div>
    <v-tableTitle :btnConfig="btnConfig" :tableSelectData="tableSelectData" title="SKU错误信息" @resend="resend" @marksucc="marksucc" @requestsku="requestsku"></v-tableTitle>
    <GTable ref="table" :hasCheck="true" :hasEdit="true" :api="apiMap.getListApi" :columnSource="baseColumns" :cbFun="cbFun" @selection-change="data => tableSelectData = data"
            @setdialog="setdialog" />

    <el-dialog :title="dialogModule.title" :visible.sync="dialogModule.flag" center v-dialogDrag width="720px" @closed="closed">
      <div v-tit="'SKU错误信息'">
        <GForm ref="detail" :config="formConfig" :rules="formRules" labelWidth="120px" v-model="form"></GForm>
      </div>
      <span slot="footer">
        <el-button type="primary" @click="handleConfirm">确定</el-button>
        <el-button @click="dialogModule.flag = false">取消</el-button>
      </span>
    </el-dialog>

    <el-dialog title="手动拉取物料" :visible.sync="dialogTableVisible" width="720px">
      <el-form ref="skuformRef"  :model="skuform">
    <el-form-item label="物料编码" :label-width="formLabelWidth">
      <el-input prop="skuform.sku" v-model="skuform.sku"  placeholder="请输入物料编码，如需批量请求用逗号隔开 sku1,sku2"></el-input>
    </el-form-item>
    <el-form-item label="响应信息" :label-width="formLabelWidth">
      <el-input prop="skuform.response" v-model="skuform.response" type ="textarea" disabled="true"></el-input>
    </el-form-item>
  </el-form>
    <div slot="footer" class="dialog-footer">
    <el-button @click="dialogTableVisible = false">取 消</el-button>
    <el-button type="primary" @click="requestk3">请求</el-button>
  </div>
  </el-dialog>
  </div>
</template>

<script>
import tableTitle from 'commons/TableTitle'

export default {
  name: 'apiSkuError',
  data() {
    return {
      dialogTableVisible:false,
      tableSelectData: [],
      dialogModule: {
        loading: false,
        flag: false,
        title: '',
        data: null,
        type: ''
      },
      formLabelWidth: '120px',
      skuform:{
        sku:'123',
        response:''
      },
      form: {
        id: null,
        name: '',
        code: '',
        type: ''
      },

    }
  },
  computed: {
    btnConfig() {
      return [
        {
          label: this.$t('common.retransmission'),
          disabled: true,
          invalid: 'del'
        },
        {
          label: this.$t('common.marksucc'),
          disabled: true,
          invalid: 'marksucc'
        },
        {
          label: this.$t('手动拉取物料'),
          invalid: 'requestsku'
        }
      ]
    },
    baseColumns() {
      return [
        {
          label: '中间表序列号',
          prop: 'serialkey',
          input: 'input'
        },
        {
          label: '仓库编码',
          prop: 'whseid',
          input: 'input'
        },
        {
          label: '物料编码',
          prop: 'sku',
          input: 'input'
        },
        {
          label: '异常信息',
          prop: 'msg',
          input: 'input'
        },
        {
          label: '处理次数',
          prop: 'midrtxqueue',
          input: 'input'
        },
        {
          label: '处理标记',
          prop: 'ediflag',
          input: 'select',
          options: [
            { label: '待处理', value: 'P' },
            { label: '处理失败', value: 'PF' }

          ]
        },
      ]
    },
    formConfig() {
      return [
        {
          label: '序列号',
          prop: 'serialkey',
          disabled: true,
          type: 'input'
        },
        {
          label: '仓库编码',
          prop: 'whseid',
          disabled: true,
          type: 'input'
        },
        {
          label: '物料编码',
          prop: 'sku',
          disabled: true,
          type: 'input'
        },
        {
          label: '异常信息',
          prop: 'msg',
          disabled: true,
          type: 'input'
        },
        {
          label: '处理次数',
          prop: 'rtxqueue',
          disabled: true,
          type: 'input'
        },
        {
          label: '处理标记',
          prop: 'ediflag',
          type: 'select',
          options: [
          { label: '待处理', value: 'P' },
          { label: '处理失败', value: 'PF' }
          ]
        }
      ]
    },
    formRules() {
      return {

      }
    },
    apiMap() {
      return {
        getListApi: '/v1/plApiskuError/qryApiSkuError',
        getInfoApi:'/v1/plApiskuError/qryApiSkuErrorById',
        editApi:'/v1/plApiskuError/udpApiSkuError',
        resendApi: '/v1/plApiskuError/resend',
        marksuccApi:'/v1/plApiskuError/marksucc',
        requestSKUAPI:'/v1/plApiskuError/requestk3sku'
      }
    }
  },
  methods: {
    handleConfirm() {
        const params = this._.cloneDeep(this.form)

        let promise
        if (this.dialogModule.type == 'edit') {
          promise = this.$post(this.apiMap.editApi, params)
        }
        promise.then(res => {
          this.$message.success(res.returnMgr)
          this.getTableData()
          this.$refs.detail?.resetFields()
          this.dialogModule.flag = false
        })

    },
    getInfoById(id) {
      this.$post(this.apiMap.getInfoApi, {
        id
      }).then(res => {
        this.form = res.data.item
        this.dialogModule.flag = true
      })
    },
    setdialog(data) {
      this.dialogModule.title = `查看SKU错误信息`
      this.dialogModule.type = 'edit'
      this.dialogModule.data = data
      this.getInfoById(data.id)
    },

    // 重发
    async resend(data) {
      this.$post(this.apiMap.resendApi, data).then(res => {
        this.$message.success(res.returnMgr)
        this.getTableData()
      })
    },
    // 标记成功
    async marksucc(data){
      this.$confirm('是否标记所选项为成功?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => {
        this.$post(this.apiMap.marksuccApi, data).then(res => {
          this.$message.success(res.returnMgr)
          this.getTableData()
        })
      });
    },

    closed() {
      this.$refs.detail?.resetFields()
    },
    cbFun(res) {
      return { list: res.data.page.records, total: res.data.page.total }
    },
    async getTableData() {
      this.$refs.table.getTableData()
    },
    requestsku(){
      this.dialogTableVisible = true;
      this.skuform.sku ='';
      this.skuform.response ='';
    },
    requestk3(){
      this.$post(this.apiMap.requestSKUAPI, {
        sku:this.skuform.sku
      }).then(res => {
        console.log(res);
        this.skuform.response=res.data.item;
      })
    }
  },
  mounted() {

  },
  components: {
    'v-tableTitle': tableTitle
  }
}
</script>

<style scoped>
</style>
